<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<title>我的诊所</title>
		<meta http-equiv="expires" content="0">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<link rel="stylesheet" href="../../../css/reset.css" />
		<link rel="stylesheet" href="../../../css/mui.min.css" />
		<link rel="stylesheet" href="../../../css/iconfont.css" />
		<link rel="stylesheet" href="../../../css/cmms.css" />
		<link rel="stylesheet" href="../../../css/sale/clinci/clinci.css" />
		<link rel="stylesheet" href="../../../css/mui.picker.min.css" />
		<script src="../../../js/vconsole.min.js"></script>
	</head>
	<body>
		<div class="mui-content" id="clinic" v-cloak>
		    <div class="top">
		    	<div class="searchbox">
		    		<input type="text" name="name" :value="cliName" placeholder="请输入诊所、医生或业务员工号"/>
		    		<span @click="search" class="btn-primary">搜索</span>
		    	</div>
		    </div>
		    <div class="item panel">
		    	<p @tap="noOrderSelect">
		    		<span><i class="iconfont icon-danju-tianchong basic-color" ></i></span>
		    		<span class="basic-color center" >未出单天筛选</span>
		    	</p>
		    	<p @tap="createClinic">
		    		<span><i class="iconfont icon-icon1 basic-color" ></i></span>
		    		<span class="basic-color center" >创建诊所</span>
		    	</p>
		    </div>
		    <div class="panel" v-for="indeInfo in indexInfo" v-if="indeInfo">
		    	<ul class="panelCon">
		    		<li class="line addLine"><span>{{indeInfo.hospitalCode}} {{indeInfo.hosptalName}}</span></li>
		    		<li class="line1 addLine">
		    			<span><i class="iconfont icon-icon1 basic-color" ></i></span>
		    			<span>{{indeInfo.doctorName}}</span>
		    			
		    			<span class="btn-tag-low" v-for="role in indeInfo.roles">{{role.name}}</span>
		    			<!--<span class="btn-detail right">漫游</span>-->
		    		</li>
		    		<li class="line2">
		    			<span>
		    				<p>
		    					<span v-for="sales in indeInfo.saleVos">{{sales.saleName}} {{sales.salePhone}}</span>
		    				</p>
		    				<p>连续{{indeInfo.outOrderDay}}天未出单</p>
		    			</span>
		    			<span class="btn-order-detail right" @tap="lookClinic(indeInfo.hosptalId)">查看所有详情</span>
		    		</li>
		    	</ul>
		    </div>
		    <div class="noData" v-if="!indexInfo.length>0">
				<p><img src="../../../img/nodata.png"/></p>
				<p>暂无内容</p>
			</div>
		</div>
		<script src="../../../js/mui.min.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="../../../js/vue.js"></script>
		<script src="../../../js/cmms.js?time=333"></script>
		<script src="../../../js/mui.picker.min.js"></script>
		<script>
			new Vue({
				el:"#clinic",
				data:{
					cliName:'',
					indexInfo:[],
					notEndOrderday:'',
					notStarOrderday:''
				},
				mounted(){
//					var vConsole = new VConsole();
					this.loadInfo();
				},
				methods:{
					loadInfo(){
						let _this = this;
						AT.muiAjax('/partner-sale/hosptal/get','post',
						{
							name:_this.cliName
						},
						function(res){
//							console.log(res);
							_this.indexInfo = res;
						});
					},
					search(){
						let _this = this;
						AT.muiAjax('/partner-sale/hosptal/get','post',
						{	
							notEndOrderday: _this.notEndOrderday,
  							notStarOrderday: _this.notStarOrderday,
							name:_this.cliName
						},
						function(res){
//							console.log(res);
							_this.indexInfo = res;
						});
					},
					lookClinic(hosptalId){
						location.href = "clinDetail.html?id="+hosptalId;
					},
					createClinic(){
						location.href = "createClinic.html"
					},
					noOrderSelect(){
						let _this = this;
						var picker = new mui.PopPicker();
						picker.setData([
							{value:'1',text:'全部'},
							{value:'2',text:'未出单天在7天内'},
							{value:'3',text:'连续8-15天未出单'},
							{value:'4',text:'连续16-30天未出单'}
						]);
						picker.show(function (selectItems) {
						    let temp = selectItems[0].value;
//						    console.log(temp);
						    switch(temp){
						    	case '1':
						    		_this.notEndOrderday='';
  									_this.notStarOrderday='';
						    		break;
						    	case '2':
						    		_this.notEndOrderday='7';
  									_this.notStarOrderday='1';
  									break;
  								case '3':
						    		_this.notEndOrderday='15';
  									_this.notStarOrderday='8';
  									break;
  								case '4':
						    		_this.notEndOrderday='30';
  									_this.notStarOrderday='16';
  									break;
						    }
//						    console.log(_this.notEndOrderday,_this.notStarOrderday);
						    AT.muiAjax('/partner-sale/hosptal/get','post',
							{	
								notEndOrderday: _this.notEndOrderday,
	  							notStarOrderday: _this.notStarOrderday,
								name:_this.cliName
							},
							function(res){
	//							console.log(res);
								_this.indexInfo = res;
							});
						})
					}
				}
			})
		</script>
	</body>
</html>
